<script setup lang="ts">
import { ref } from 'vue';
import { handleMessage } from '@/utils/globalEvent';

// 加载提示文字
const title = ref<string>('处理中');
// 更改加载提示文字
const setTitle = (val: string) => {
	title.value = val;
};
// 点击loading
const onLoading = () => {
	if (!title.value) return;
	handleMessage(title.value, 'warning');
};

// 暴露出去
defineExpose({
	setTitle,
});
</script>

<template>
	<div class="btn-loading" @click.stop="onLoading">
		<i class="iconfont icon-loading"></i>
		<span>{{ title }}</span>
	</div>
</template>

<style lang="less" scoped>
@import url('./index.less');
</style>
